<!DOCTYPE html>
<html>
<head>
    <title>挂架表vue</title>
    <link rel="stylesheet" href="/static/layui/css/layui.css" media="all" />
    <script type="text/javascript" src="/static/layui/layui.js"></script>
    <script src="/static/js/vue.js" type="application/javascript"></script>
<!--    <script src="/static/js/axios.min.js" type="application/javascript"></script>-->
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
    <script type="text/javascript" src="/static/js/base.js"></script>
<body class="layui-anim layui-anim-up">
<div class="x-nav">
      <span class="layui-breadcrumb">
        <a href="">首页</a>
        <a>
          <cite>挂架表vue</cite>
        </a>
      </span>
</div>
<div class="x-body" id="app">

    <div class="layui-row" style="margin-bottom: 18px">
        <div class="layui-form">
            <div class="layui-input-inline">

                <div class="layui-input-inline" style="width: 150px">
                    <input class="layui-input" id="keyword01" placeholder="请输入挂架编号" style="width: 150px">
                </div>
                <button class="layui-btn layui-btn-normal" data-type="reload"><i class="layui-icon layui-icon-search"></i>检索</button>
            </div>
        </div>
    </div>

    <xblock>
        <button class="layui-btn layui-btn-warm" id="add"><i class="layui-icon layui-icon-add-circle-fine"></i>新增</button>
        <!--<button class="layui-btn layui-btn-danger" id="del"><i class="layui-icon layui-icon-delete"></i>批量删除</button>-->
    </xblock>
    <table class="layui-table" id="dataTableVue" lay-filter="dataTableVue">
        <thead>
        <tr>
            <th>序号</th>
            <th>挂架编号</th>
            <th>挂架名称</th>
            <th>操作</th>
        </tr>
        </thead>
        <tbody>
            <tr v-for="item in list">
                <td>1</td>
                <td>{{item.pyNumber}}</td>
                <td>{{item.pyName}}</td>
                <td>4</td>
            </tr>
        </tbody>
    </table>
</div>
<script>
    var vm = new Vue({
        el:'#app',
        data:{
            list: [],
            total: -1,
            pageIndex: 1,
            pageSize:2,
        },
        created:function () {
            this.queryPylonsPage()
        },
        updated: function () {
            layui.use('form', function(){
                var form = layui.form;
                form.render();
            });
        },
        methods: {
            queryPylonsPage: function () {
                axios.get('/pylons/queryPylonsPage',{
                        params: {
                            page:1,
                            limit:10
                        }
                    }
                ).then(function (result) {
                    //console.log(result.data.data);
                    //this.list = result.data.data;
                    //this.total = result.data.total;
                    this.list = JSON.parse(JSON.stringify(result.data.data))
                    console.log(this.list)
                }).catch(function (error) {

                })
            }
        }
    });
</script>


</body>

</html>
